<template>
    <div>
        <Form ref="formInline" :model="obj" :label-width="90">
            <FormItem label="归属公司：">
                <Input v-model="obj.company_name"  disabled class="wid"></Input>
            </FormItem>
            <FormItem label="手机号码：">
                <Input v-model="obj.mobile" placeholder="手机号码" class="wid"></Input>
            </FormItem>
            <FormItem label="姓名：">
                <Input v-model="obj.name" placeholder="姓名" class="wid"></Input>
            </FormItem>
            <FormItem label="密码：">
                <Input v-model="obj.password" maxlength="20" type="password" placeholder="密码" class="wid"></Input>
            </FormItem>
            <FormItem label="确认密码：">
                <Input v-model="obj.passwordc" maxlength="20" type="password" placeholder="确认密码" class="wid"></Input>
            </FormItem>
            <FormItem label="邮箱：">
                <Input v-model="obj.email" placeholder="邮箱" class="wid"></Input>
            </FormItem>
            <FormItem label="电话：">
                <Input v-model="obj.phone" placeholder="电话" class="wid"></Input>
            </FormItem>
            <FormItem label="允许登录：">
                <i-switch v-model="obj.login_flag" size="large">
                    <span slot="1">On</span>
                    <span slot="0">Off</span>
                </i-switch>
            </FormItem>
            <FormItem label="用户类型：">
                <Select v-model="obj.user_type" class="wid">
                    <Option value="1">系统管理</Option>
                    <Option value="2">部门经理</Option>
                    <Option value="3">普通用户</Option>
                    <Option value="9">接口对接</Option>
                </Select>
            </FormItem>
            <FormItem label="用户角色：">
                <CheckboxGroup v-model="border" >
                    <Checkbox v-for="(item,index) in spanList"  :key="index" :label="item.name" border>{{item.name}}</Checkbox>
                </CheckboxGroup>
            </FormItem>
            <FormItem label="备注：">
                <Input v-model="obj.remarks" type="textarea" class="wid" placeholder=""/>
            </FormItem>
        </Form>
        <div>
            <Button class="clic" type="primary" shape="circle" @click="add(obj)">添加</Button>
            <Button class="ml20" shape="circle" @click="cancel">取消</Button>
        </div>
    </div>
</template>

<script>
import { addUser } from '../../../../../api/system/system'

export default {
  name: 'UserForm',
  props: {
    treeID: String,
    treeIDName: String,
    btnlist: Array

  },
  data () {
    return {
      border: [],
      obj: {
        company_name: ''
      },
      company_id: '',
      company_name: '',
      spanList: {},
      disabled: false,
      rolelist: []
    }
  },
  watch: {
    treeID (treeID) {
      this.company_id = treeID
    },
    treeIDName (treeIDName) {
      this.company_name = treeIDName
      this.obj.company_name = treeIDName
    },
    btnlist (btnlist) {
      this.spanList = btnlist
    }
  },
  methods: {
    add (obj) {
      console.log()
      if (this.obj.mobile === null || this.obj.mobile === '' || this.obj.mobile === undefined) {
        this.$Message.info('请填写手机号码！')
        return
      }
      var reg = /^((13[0-9])|(17[0-1,6-8])|(15[^4,\\D])|(18[0-9]))\d{8}$/
      if (reg.test(this.obj.mobile) === false) {
        this.$Message.info('请输入正确手机号！')
        this.obj.mobile = ''
      }
      if (this.obj.name === null || this.obj.name === '' || this.obj.name === undefined) {
        this.$Message.info('请填写姓名！')
        return
      }
      if (this.obj.password === null || this.obj.password === '' || this.obj.password === undefined) {
        this.$Message.info('请填写密码！')
        return
      }
      if (this.obj.passwordc === null || this.obj.passwordc === '' || this.obj.passwordc === undefined) {
        this.$Message.info('请再次填写密码！')
        return
      }
      if (this.obj.passwordc !== this.obj.password) {
        this.$Message.info('两次密码不相同！')
        return
      }
      if (this.obj.user_type) {
        this.logic = '1'
      } else {
        this.logic = '0'
      }
      this.border.forEach(item => {
        this.spanList.forEach(item1 => {
          if (item === item1.name) {
            this.rolelist.push(item1)
          }
        })
      })

      this.rolelist.forEach(item2 => {
        item2.active = true
      })
      let data = {
        company_id: this.treeID,
        company_name: this.obj.company_name,
        email: this.obj.email,
        login_flag: this.logic,
        mobile: this.obj.mobile,
        name: this.obj.name,
        password: this.obj.password,
        passwordc: this.obj.passwordc,
        phone: this.obj.phone,
        remarks: this.obj.remarks,
        rolelist: this.rolelist,
        user_type: this.obj.user_type
      }
      console.log(data)
      addUser(data).then(ret => {
        if (ret.data.errcode === 0) {
          this.$Notice.success({
            title: ret.data.data.Message,
            desc: '账号为:' + ret.data.data.login_name,
            duration: 0
          })
          this.$emit('cancel')
          this.obj = {}
          this.border = []
        } else {
          this.$Notice.error({
            title: '失败',
            desc: ret.data.errmsg
          })
        }
      })
    },
    cancel () {
      this.$emit('cancel')
    }
  },
  mounted () {

  }
}
</script>

<style scoped>

</style>
